<!DOCTYPE html>
<html>
<head>
<title>关于</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<!-- Custom Theme files -->
<!--theme-style-->
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />	
<!--//theme-style-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Awareness Responsive web template, Bootstrap Web Templates, Flat Web Templates, Android Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!--fonts-->
<link href='https://fonts.googleapis.com/css?family=Arimo:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Raleway:400,700,800,600,500' rel='stylesheet' type='text/css'>
</head>
<body> 
<!--header-->	
<div class="header" >
	<div class="col-md-3 header-top cbp-spmenu-push">
		<nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s1">
			<a  href="index.html">主页</a>
			<a  href="about.html">关于</a>
			<a  href="services.html">服务</a>
			<a  href="single.html" >留言板</a>
			<a  href="contact.html">联系我们</a>
		</nav>
		<!-- /script-nav -->
			<div class="main">
				<section class="buttonset">
					<button id="showLeftPush"><i  class="glyphicon glyphicon-menu-hamburger"></i></button>
				</section>
			</div>
			<!-- Classie - class helper functions by @desandro https://github.com/desandro/classie -->
				<script src="js/classie.js"></script>
					<script>
						var	menuLeft = document.getElementById( 'cbp-spmenu-s1' ),
						showLeftPush = document.getElementById( 'showLeftPush' ),
						body = document.body;
							
						showLeftPush.onclick = function() {
							classie.toggle( this, 'active' );
							classie.toggle( body, 'cbp-spmenu-push-toright' );
							classie.toggle( menuLeft, 'cbp-spmenu-open' );
							disableOther( 'showLeftPush' );
						};
					</script>
	</div>
	<div class="col-md-6 logo">
		<h1><a href="index.html"><span>·</span>BOOOK</a></h1>
	</div>
	<div class="col-md-3 search">
		<a class="play-icon popup-with-zoom-anim" href="#small-dialog"><i class="glyphicon glyphicon-search"> </i></a>
	</div>
	<div class="clearfix"> </div>
</div>
	<!---pop-up-box---->					  
	<link href="css/popuo-box.css" rel="stylesheet" type="text/css" media="all"/>
	<script src="js/jquery.magnific-popup.js" type="text/javascript"></script>
	<!---//pop-up-box---->
	<div id="small-dialog" class="mfp-hide">
		<div class="search-top">
			<div class="login">
				<input type="submit" value="">
				<input type="text" value="搜索.." onFocus="this.value = '';" onBlur="if (this.value == '') {this.value = 'Search..';}">		
			</div>
			<p>Books</p>
		</div>				
	</div>
		 <script>
			$(document).ready(function() {
			$('.popup-with-zoom-anim').magnificPopup({
			type: 'inline',
			fixedContentPos: false,
			fixedBgPos: true,
			overflowY: 'auto',
			closeBtnInside: true,
			preloader: false,
			midClick: true,
			removalDelay: 300,
			mainClass: 'my-mfp-zoom-in'
			});
																						
			});
		</script>		
<!--//header-->
<!--banner-->
<div class="head">
	<div class="container">
		<h2 > <a href="index.html">主页</a> / <span>关于 </span></h2>	
	</div>
</div>
<!--content-->
<div class="about">
	<div class="container">
		<div class="about-top">
			<div class="col-md-4 red">
					<a href="single.html"><img class="img-responsive" src="images/ab.jpg" alt=""></a>
				</div>
				<div class="col-md-8 come">
					<div class=" about-wel">
						<h5><a href="index.html">BOOOK书店的由来</a></h5>
								<p>近年来人们对精神追求的需求日益增加，越来越多的年轻人喜欢去书店，这是一个商机，但是单纯的书店内容过于单一，不能满足青少年对新鲜感的追求，所以拓展了相关的项目。
									而且本人喜欢看书看电影，设想过以后退休了就开一家书店，所以这次的创业计划选择了书店。</p>
					<ul>
						<li><a href="#"><i class="glyphicon glyphicon-ok"></i>主要受众：18-25岁的青少年</a></li>
						<li><a href="#"><i class="glyphicon glyphicon-ok"></i>主营业务：书影，饮品，时光邮局</a></li>
						<li><a href="#"><i class="glyphicon glyphicon-ok"></i>营业时间： 24h</a></li>
						<li><a href="#"><i class="glyphicon glyphicon-ok"></i>盈利来源： 饮品，私影</a></li>
						<li><a href="#"><i class="glyphicon glyphicon-ok"></i>拓展业务： 文具周边</a></li>
					</ul>
					</div>
				</div>
				
				<div class="clearfix"> </div>
		
			</div>
			
	</div>
	<!---->
	<div class="team">
		<div class="container">
			<h3>Team</h3>
			<div class="col-md-3 team-men">
				<img src="images/te.jpg" class="img-responsive" alt="">	
				<h5>店长</h5>	
				<p>&nbsp;&nbsp;&nbsp;书店创始人，大事的决定人，书店的大boss。</p>				
			</div>
			<div class="col-md-3 team-men">
				<img src="images/te1.jpg" class="img-responsive" alt="">	
				<h5>副店长（2名）</h5>	
				<p>&nbsp;&nbsp;&nbsp;一名管理图书借阅，时光邮局；另一名管理饮品和私影。</p>				
			</div>
			<div class="col-md-3 team-men">
				<img src="images/te2.jpg" class="img-responsive" alt="">	
				<h5>收银员（2名）</h5>	
				<p>&nbsp;&nbsp;&nbsp;要求认真诚实，人品可靠。</p>				
			</div>
			<div class="col-md-3 team-men">
				<img src="images/te3.jpg" class="img-responsive" alt="">	
				<h5>服务员（3名）</h5>	
				<p>&nbsp;&nbsp;&nbsp;解答顾客的疑问，打扫书店卫生。</p>				
			</div>
			<div class="clearfix"> </div>
		</div>
	</div>

<!--footter-->
<div class="footer">
	<div class="footer-mid">
			<div class="container">
				<div class="col-sm-3 ft-grid1">
					<h3>Location</h3>
					<p>CHINA XTU</p>
					<P>Contact@example.com</P>
					<p>+12 312 341 234</p>
				</div>
				<div class="col-sm-3 ft-grid2">
				<h3>Follow Us</h3>
					<ul class="social-in">
						<li><a href="#"><i> </i></a></li>						
						<li><a href="#"><i class="twitter"> </i></a></li>
						<li><a href="#"><i class="dribbble"> </i></a></li>						
					</ul>
				</div>
				<div class="col-sm-6 ft-grid1">
					<h3>Newsletter</h3>
					<form>
						<input type="text" value="" onfocus="this.value='';" onblur="if (this.value == '') {this.value ='';}">
						<input type="submit" value="提交">
					</form>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
		<div class="class-footer">
			<div class="container">
				<div class="col-md-6 footer-nav">
					<ul>
						<li ><a  href="index.html" >主页</a></li>
						<li><a  href="about.html"  >关于我们</a></li>
						<li><a href="services.html">服务</a></li>
						<li><a  href="single.html" >留言板</a></li>
						<li><a href="contact.html" >联系我们</a></li>
						
					</ul>
				</div>
				<div class="col-md-6 footer-grid">
					<p >Copyright &copy; BOOOK书店</p>	
				</div>
					<div class="clearfix"> </div>
		</div>
	</div>
</div>
<!--//footter-->
</body>
</html>